<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('拆垛区库存明细')"/>
    <style>
        [v-cloak] {
            display: none;
        }
    </style>
</head>
<body>
<div class="container-div">
    <el-row :gutter="20">
        <el-col :span="24">
            <el-tabs type="border-card" class="deer-panel" style="margin-top: 15px;padding-top: 0">
                <el-tab-pane>
                    <span slot="label"><i class="el-icon-date"></i> 单晶详情</span>
                    <el-table :data="item.list" border stripe height="460" style="width: 100%">
                        <el-table-column prop="materialProduct" label="物料编码" align="center" width="120"></el-table-column>
                        <el-table-column prop="materialId" label="单晶编号" align="center" width="250"></el-table-column>
                        <el-table-column prop="carrierId" label="托盘号" align="center" width="120"></el-table-column>
                        <el-table-column prop="specId" label="单晶规格" align="center"></el-table-column>
                        <el-table-column prop="materialCategory" label="客户等级" align="center"></el-table-column>
                        <el-table-column prop="materialPN" label="单晶PN型" align="center"></el-table-column>
                        <el-table-column prop="assemblyText" label="拼棒类型" align="center"></el-table-column>
                        <el-table-column prop="inTime" label="入库时间" align="center" width="155"></el-table-column>
                    </el-table>
                    <el-pagination
                        @current-change="chengCurrentPage"
                        :current-page="item.currentPage"
                        :page-size="item.pageSize"
                        layout="prev, pager, next"
                        :total="item.total">
                    </el-pagination>
                </el-tab-pane>
            </el-tabs>
        </el-col>
    </el-row>
</div>

<div th:include="include::footer"></div>
<script th:inline="javascript">
    var detailPrefix = ctx + "in/boxItem";

    var carrierId = localStorage.getItem(detailPrefix+'/bufferStorageDetail');

    var vue = new Vue({
        el: '.container-div',
        data: {
            item: {
                currentPage: 1,
                pageSize: 8,
                total: '',
                list: []
            }
        },
        methods: {
            //分页
            chengCurrentPage: function(currentPage){
                this.item.currentPage = currentPage;
                this.getDetails(null);
            },
            getDetails(){
                var that = this;
                $.ajax({
                    url: detailPrefix + "/bufferStorageDetailList",
                    type: "POST",
                    data: {
                        carrierId: carrierId,
                        pageSize: that.item.pageSize,
                        pageNum: that.item.currentPage
                    },
                    error: function(request){
                        $.modal.alertError("系统错误");
                    },
                    success: function(data){
                        var msg = data.rows;
                        for(var i = 0; i < msg.length; i++){
                            if(msg[i].inTime != null){
                                msg[i].inTime = msg[i].inTime.slice(0, 19);
                            }
                            if(msg[i].assemblyType == 1){
                                msg[i].assemblyText = '整棒';
                            }else if(msg[i].assemblyType == 2){
                                msg[i].assemblyText = '二拼';
                            }else if(msg[i].assemblyType == 3){
                                msg[i].assemblyText = '三拼';
                            }
                        }
                        that.item.list = msg;
                        that.item.total = data.total;
                    }
                })
            }
        },
        created(){
            this.getDetails();
        }
    })
</script>
</body>
</html>
